<template>
<div>
    <Form label-position="top">
        <Row :gutter="40">
        <Col span="8">
        <FormItem label="所属机构">
            <Input v-model="obj.parentShortName" 
            :placeholder="$route.params.type != 'detail' ? '请输入所属机构' : ''" disabled />
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="机构编号" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.code" 
            :placeholder="$route.params.type != 'detail' ? '请输入机构编号' : ''" 
            :disabled="$route.params.type == 'detail' || $route.params.type == 'edit' ? true : false"/>
        </FormItem>
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="机构全称" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.name" 
            :placeholder="$route.params.type != 'detail' ? '请输入机构全称' : ''" 
            :disabled="$route.params.type == 'detail' ? true : false"/>
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="机构简称" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.shortName" 
            :placeholder="$route.params.type != 'detail' ? '请输入机构简称' : ''" 
            :disabled="$route.params.type == 'detail' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
            <FormItem label="所在地区" :required="$route.params.type == 'detail' ? false : true">
                <Row :gutter="10">
                    <Col span="8">
                        <Select v-model="obj.provinceId" @on-change="changeProvince(obj.provinceId)" :disabled="$route.params.type == 'detail' ? true : false">
                            <Option v-for="(item, index) in provinceArr" :key="index" :value="item.id">{{ item.name }}</Option>
                        </Select>
                    </Col>
                    <Col span="8"> 
                        <Select v-model="obj.cityId" @on-change="changeCity(obj.cityId)" :disabled="$route.params.type == 'detail' ? true : false">
                            <Option v-for="(item, index) in citiesArr" :key="index" :value="item.id">{{ item.name }}</Option>
                        </Select>
                    </Col>
                    <Col span="8">
                        <Select v-model="obj.districtId" :disabled="$route.params.type == 'detail' ? true : false">
                            <Option v-for="(item, index) in countyArr" :key="index" :value="item.id">{{ item.name }}</Option>
                        </Select>
                    </Col>
                </Row>
            </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="联系人" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.linkman" 
                :placeholder="$route.params.type != 'detail' ? '请输入联系人' : ''" 
                :disabled="$route.params.type == 'detail' ? true : false"/>
        </FormItem>
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="办公地址" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.address" 
            :placeholder="$route.params.type != 'detail' ? '请输入办公地址' : ''" 
            :disabled="$route.params.type == 'detail' ? true : false"/>
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="联系电话" :required="$route.params.type == 'detail' ? false : true">
            <Input v-model="obj.linkmanPhone" 
            :placeholder="$route.params.type != 'detail' ? '请输入联系电话' : ''"  
            :disabled="$route.params.type == 'detail' ? true : false"/>
        </FormItem>
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="16">
        <FormItem label="概况说明">
            <Input v-model="obj.description" 
            :placeholder="$route.params.type != 'detail' ? '请输入概况说明' : ''" :rows="4" type="textarea" 
            :disabled="$route.params.type == 'detail' ? true : false" />
        </FormItem>
        </Col>
    </Row>
    </Form>
</div>
</template>

<script>
import closeTag from '../../../../mixins/closeTag'
export default {
    props: ['obj'],
    mixins: [closeTag],
    data() {
        return {
            params: {
                whereMap: {
                    parentId: '0'
                }
            },
            provinceArr: [],
            citiesArr: [],
            countyArr: [],
            ledgerObj: {},
            showCity: true,
            showCounty: true
        }
    },
    mounted() {
        this.regionList()
        if (this.$route.params.type === 'add') {
            this.getCode();
        }
        this.obj.parentShortName = this.$route.query.parentName
        setTimeout(()=>{
            this.regionListShi(this.obj.provinceId)
            this.regionListQu(this.obj.cityId)
        },2000)
    },
    methods: {
        getCode() {
            let data = {
                type: this.$route.query.type,
                parentId: this.$route.params.id
            }
            this.$api.companyOrganization.codeGenerate(data).then(resp => {
                if (resp.code == 200) {
                    this.obj.code = resp.data;
                }
            })
        },
        // 取消
        cancel() {
            let parmes = {
                name: this.$route.params.name,
                id: this.$route.params.id,
                type: this.$route.params.type
            }
            this.closetabParams('add-company', parmes)
        },
        // 省市区三级联动  省级
        regionList() {
            this.$api.companyOrganization.regionList(this.params).then(resp => {
                if (resp.code == 200) {
                    this.provinceArr = resp.data.resultObject
                } else {
                    this.$Message.warning(resp.message)
                }
            })
        },
        // 省市区三级联动  市级
        regionListShi(id) {
            if(id){
                let parmes = {
                    whereMap:{
                        parentId:id
                    }
                }
                this.$api.companyOrganization.regionList(parmes).then(resp => {
                    if (resp.code == 200) {
                        this.citiesArr = resp.data.resultObject
                    } else {
                        this.$Message.warning(resp.message)
                    }
                })
            }else{
                this.citiesArr = []
            }
        },
        // 省市区三级联动  区级
        regionListQu(id) {
            if(id){
                let parmes = {
                    whereMap:{
                        parentId:id
                    }
                }
                this.$api.companyOrganization.regionList(parmes).then(resp => {
                    if (resp.code == 200) {
                        this.countyArr = resp.data.resultObject
                    } else {
                        this.$Message.warning(resp.message)
                    }
                })
            }else{
                this.countyArr = []
            }
        },
        changeProvince(id) {
            this.citiesArr = []
            this.countyArr = []
            this.obj.cityId = ''
            this.obj.districtId = ''
            this.regionListShi(id)
        },
        changeCity(id) {
            this.countyArr = []
            this.regionListQu(id)
        }
    }
}
</script>

<style scoped>
.jg-name {
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: block;
}
</style>
